<template>
	<view>
		<u-navbar :is-back="true" title=" ">
			<view slot="right">
				<view class="right-frame flexal" @click="go('/pages6/metting/mettingRecord')">
					<text>历史会议</text>
					<image src="/static/right.png" class="right-icon"></image>
				</view>
			</view>
		</u-navbar>
		<view class="flexcumal">
		<u-input v-model="value" :type="type" :border="border" 
		class="frame-input"
		:custom-style="{'text-align': 'center','border-bottom': '1rpx solid #B7B7B7','width': '404rpx','font-size': '40rpx','color': '#535353'}"
		 placeholder="请输入会议名称" />
		</view>
		<view class="flexcumal">
		<u-input v-model="valueDate" :type="type" :border="border" 
		style="margin-top: 25rpx;" @click="show = !show"
		:custom-style="{'text-align': 'center','border-bottom': '1rpx solid #B7B7B7','width': '404rpx','font-size': '40rpx','color': '#535353'}"
		 placeholder="开始时间" />
		</view>
		<view class="flexcumal">
			<image :src="avatar" class="img-avatar"></image>
		</view>
		<view class="flexcumal" style="margin-top: 16rpx;">
			<view class="flexal">
				<text class="name-text">姓名</text>
				<image src="/static/metting/stopAudio.png" v-if="stopAudio" style="width: 24rpx;height: 30rpx;"></image>
				<image src="/static/metting/payAudio.png" v-else style="width: 24rpx;height: 30rpx;"></image>
			</view>
		</view>
		
		<view class="flexal" style="margin-top: 400rpx;margin-left: 8rpx;">
			<view class="frame-item flexcumal" @click="stopAudio = !stopAudio">
				<image src="/static/metting/stop-audio1.png" v-if="stopAudio" style="width: 54rpx; height: 54rpx;"></image>
				<image src="/static/metting/pay-audio1.png" v-else style="width: 54rpx; height: 54rpx;"></image>
				<text style="margin-top: 11rpx;">麦克风</text>
			</view>
			<view class="frame-item flexcumal" @click="stopVideo = !stopVideo">
				<image src="/static/metting/stop-video1.png" v-if="stopVideo" style="width: 54rpx; height: 54rpx;"></image>
				<image src="/static/metting/pay-video1.png" v-else style="width: 54rpx; height: 54rpx;"></image>
				<text style="margin-top: 11rpx;">摄像头</text>
			</view>
			<view class="frame-item flexcumal" @click="stopBugle = !stopBugle">
				<image src="/static/metting/stop-bugle.png" v-if="stopBugle" style="width: 54rpx; height: 54rpx;"></image>
				<image src="/static/metting/pay-bugle.png" v-else style="width: 54rpx; height: 54rpx;"></image>
				<text style="margin-top: 11rpx;">扬声器</text>
			</view>
		</view>
		
		<view class="flexcumal" style="margin-top: 90rpx;">
			<view class="button flexcen" @click="go('/pages6/metting/proceed')">
				开始会议
			</view>
		</view>
		<!-- 日期选择器 -->
		<u-picker mode="time" v-model="show" :params="params" @confirm="dateConfirm"></u-picker>
		<!-- 电话提示滑动快 -->
		<movablearea1 :movaheight="movaheightAll" v-if="movableareaShow" @editMovaheightAll="editMovaheightAll" :movaTop="movaTopAll"></movablearea1>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '',
				type: 'text',
				border: false,
				avatar:'https://cdn.uviewui.com/uview/album/10.jpg',
				stopAudio:false,
				stopVideo:false,
				stopBugle:false,
				show:false,
				valueDate:'',
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: false
				},
			}
		},
		methods: {
			dateConfirm(e){
				console.log('e',e)
				this.valueDate = e.year + '/' + e.month + '/' + e.day + ' ' + e.hour + ':' + e.minute
			}
		}
	}
</script>

<style lang="less">
	
	.right-frame{
		margin-right: 32rpx;
		padding-left: 17rpx;
		width: 174rpx;
		height: 45rpx;
		background: #F2F3FF;
		border-radius: 9rpx 9rpx 9rpx 9rpx;
		font-weight: 400;
		font-size: 30rpx;
		color: #424A57;
		
		.right-icon{
			margin-left: 11rpx;
			width: 14rpx;
			height: 24rpx;
		}
	}
	
	.frame-input{
		margin-top: 67rpx;
	}
	
	.img-avatar{
		margin-top: 187rpx;
		width: 160rpx;
		height: 160rpx;
		border-radius: 50%;
	}
	.name-text{
		margin-left: 25rpx;
		margin-right: 15rpx;
		font-weight: 400;
		font-size: 30rpx;
		color: #000000;
	}
	.frame-item{
		margin-left: 24rpx;
		width: 213rpx;
		height: 146rpx;
		background: #F2F3F5;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-weight: 400;
		font-size: 26rpx;
		color: #6E6E6E;
		justify-content: center;
	}
	
	.button{
		width: 686rpx;
		height: 80rpx;
		background: #0052D9;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-weight: normal;
		font-size: 30rpx;	
		color: #FFFFFF;
	}
	
	.icon{
		width: 40rpx;
		height: 40rpx;
	}

</style>
